package org.teamh.gui.createGame;


import org.teamh.gui.GUI;
import org.teamh.gui.lobby.LobbyController;
import org.teamh.logic.lobby.Map;

import de.lessvoid.nifty.builder.ImageBuilder;
import de.lessvoid.nifty.builder.PanelBuilder;
import de.lessvoid.nifty.builder.PopupBuilder;
import de.lessvoid.nifty.builder.TextBuilder;
import de.lessvoid.nifty.controls.Button;
import de.lessvoid.nifty.controls.ListBox;
import de.lessvoid.nifty.controls.button.builder.ButtonBuilder;
import de.lessvoid.nifty.controls.listbox.builder.ListBoxBuilder;
import de.lessvoid.nifty.controls.textfield.builder.TextFieldBuilder;
import de.lessvoid.nifty.elements.Element;
import de.lessvoid.nifty.elements.render.TextRenderer;
import de.lessvoid.nifty.input.NiftyInputEvent;
import de.lessvoid.nifty.screen.KeyInputHandler;
import de.lessvoid.nifty.tools.Color;

public class CreateGameScreen {

	private GUI gui;
	private LobbyController lobbyController;
	private Element createGame;
	private ListBox<String> maps;
	private Button createGameButtonPopup;
	private TextRenderer mapnametext;
	
	public CreateGameScreen(LobbyController lobbyController) {
		this.lobbyController = lobbyController;
		this.gui = this.lobbyController.getGui();
		initPopUp();
	}
	
	@SuppressWarnings("unchecked")
	private void initPopUp() {
		new PopupBuilder("createGame") {
			{
				//gui.getNifty().getScreen("createGameScreen").findControl("CreateGameController", CreateGameController.class);
				//controller(new CreateGameController(gui));
				childLayoutCenter();
				backgroundColor("#000a");
				panel(new PanelBuilder() {{
					
				childLayoutCenter();

				paddingTop("23px");
				paddingLeft("0px");
				childLayoutCenter();
				width("*");
				height("768px");
				//backgroundColor("#333");
				backgroundColor("#333");
				interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
				

				
				//Grosses aeusseres Panel um mapPreviewImage/Players2Image/Players3Image/Players4Image und die buttons,logo etc (rechts)
				panel(new PanelBuilder() {{
					
					paddingTop("50px");
                    childLayoutVertical();
					alignCenter();
					style("nifty-panel");
					width("600px");
					height("725px");
					paddingTop("5");
					visibleToMouse(true);
					interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
					
					
					
					
					//chooseGamename
					panel(new PanelBuilder() {{
						text(new TextBuilder() {{
							name("chooseGamename");
							id("chooseGamename");
							font("verdana-small-regular.fnt");
							color(new Color(1,1,1,1));
							text("CHOOSE GAMENAME");
						}});
						backgroundColor(new Color(0, 1, 1, 0.1f));
						paddingLeft("5");
						width("564");
						height("30");
						visibleToMouse(true);
						childLayoutCenter();
						visible(true);
						interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
						
					}});
					//ENDE chooseGamename

					//panel um Spielernameneingabe(Logintext und Eingabe)
					panel(new PanelBuilder("LoginTextfieldAndInput") {{
						//paddingLeft("170");
						paddingLeft("160");
						paddingTop("10px");
                        childLayoutHorizontal();
						alignCenter();
						width("600px");
						height("50px");
						paddingTop("5");
						interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
						
					//Spielnameneingabe
					//GameNameTexfeld	
					panel(new PanelBuilder() {{ 
						paddingTop("10px");
						name("GameNameTextfield");
						id("GameNameTextfield");
						childLayoutCenter();
						width("130");
						text(new TextBuilder() {{
							font("verdana-small-regular.fnt");
							color(new Color(1,1,1,1));
							text("Name");
						}});
						visible(true);
						interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
						
					}});
					//ENDE GameNameTexfeld
					//GameNameInputfield
					panel(new PanelBuilder() {{ 
						paddingTop("10px");
						childLayoutCenter();
						visibleToMouse(true);
						control(new TextFieldBuilder("eingabeName") {{
							width("100");
							font("verdana-small-regular.fnt");
						}});
						interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
						
					}});
					//ENDE GameNameInputfield
					//ENDE Spielnameneingabe
					}});//panel Spielernameneingabe(Logintext und Eingabe)
					

					//Panel um Bilder und Buttons
					panel(new PanelBuilder() {{
						backgroundColor(new Color(1, 1, 1, 0.01f));
                        childLayoutVertical();
						paddingTop("5");
						width("245");
						height("300");
						interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
						
						//chooseMaptext
						panel(new PanelBuilder() {{
							interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
							
							text(new TextBuilder() {{
								name("chooseMaptext");
								id("chooseMaptext");
								font("verdana-small-regular.fnt");
								color(new Color(1,1,1,1));
								text("CHOOSE MAP");
							}});
							backgroundColor(new Color(0, 1, 1, 0.1f));
							paddingLeft("5");
							width("564");
							height("30");
							visibleToMouse(true);
							childLayoutCenter();
							visible(true);
						}});
						//ENDE MapnametextchooseMaptext
						
						//Panel um Mapnametext und Maplisttext
						panel(new PanelBuilder() {{
							childLayoutHorizontal();
						//Mapnametext
						panel(new PanelBuilder() {{
							text(new TextBuilder() {{
								name("Mapnametext");
								id("Mapnametext");
								font("verdana-small-regular.fnt");
								color(new Color(1,1,1,1));
								text("no map loaded");
							}});
							paddingTop("10");
							width("245");
							height("30");
							visibleToMouse(true);
							childLayoutCenter();
							visible(true);
						}});
						//ENDE Mapnametext
						//Maplisttext
						panel(new PanelBuilder() {{
							text(new TextBuilder() {{
								name("Maplisttext");
								id("Maplisttext");
								font("verdana-small-regular.fnt");
								color(new Color(1,1,1,1));
								text("List of Maps:");
							}});
							paddingTop("10");
							width("245");
							height("30");
							visibleToMouse(true);
							childLayoutCenter();
							visible(true);
						}});
						//ENDE Maplisttext
						}});//ENDE Panel um Mapnametext und Maplisttext
						
															
						//Panel um MapPreviewImage und Maplist
						panel(new PanelBuilder() {{
							id("MapPrewiewImageAndMaplist");
							name("MapPrewiewImageAndMaplist");
							childLayoutHorizontal();
							width("540");
							height("200");
							visibleToMouse(true);
							interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
							
							
						//Panel um MapPreviewImage
						panel(new PanelBuilder() {{
							paddingTop("5");
							width("245");
							height("205");
							visibleToMouse(true);
							childLayoutCenter();
							interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
							
						// Rahmen um MapPreviewImage
						    panel(new PanelBuilder() {{
								id("borderMapPreviewImage");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
								name("borderMapPreviewImage");
								backgroundColor(new Color(0, 0, 0, 1));
								width("168");
								height("168");
								visibleToMouse(true);
								childLayoutAbsolute();
								interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
								visible(true);
						    }});//ENDE Rahmen um MapPreviewImage
						//angeklickter-Rahmen um MapPreviewImage
							panel(new PanelBuilder() {{
								id("borderMapPreviewImageClicked");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
								name("borderMapPreviewImageClicked");
								backgroundColor(new Color(1, 0, 0, 0.8f));
								width("168");
								height("168");
								visibleToMouse(true);
								childLayoutAbsolute();
								interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
								visible(false);
							}});//ENDE angeklickter-Rahmen um MapPreviewImage	
							
							
							
						//MapPreviewImage
						panel(new PanelBuilder() {{
							backgroundColor(new Color(0, 1, 1, 0.01f));
							width("60");
							height("60");
							visibleToMouse(true);
							childLayoutCenter();
							image(new ImageBuilder("map_preview"){{
							name("startpicture");
							filename("res/img/createGame/nomap.png");
							width("160");
							height("160");
							alignCenter();
		    				valignCenter();
		    				visible(true);
		    				interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
							}});
						}});
						//Ende MapPreviewImage
						
						//Hovereffekt-Ebene von MapPreviewImage
						panel(new PanelBuilder() {{
							id("HovereffectMapPreviewImage");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
							name("HovereffectMapPreviewImage");
							backgroundColor(new Color(1, 1, 1, 0.07f));
							width("68");
							height("68");
							visibleToMouse(true);
							childLayoutAbsolute();
							interactOnClick("startclick()");
		    				interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
							visible(false);
						}});//ENDE Hovereffekt-Ebene von MapPreviewImage	
													
						}});//ENDE Panel um MapPreviewImage
						
						//Maplist
						panel(new PanelBuilder() {{
							paddingTop("8");
							childLayoutCenter();
							width("300");
							height("200");
							control(new ListBoxBuilder("maplist"){{
								style("nifty-listbox");
								hideHorizontalScrollbar();
								optionalVerticalScrollbar();
								selectionModeSingle();
								width("250");
								displayItems((768/64)-5);
							}});
							interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
							
						}});
						//Ende Maplist
						
					}});//ENDE Panel um MapPreviewImage und Maplist
					

						//Spieleranzahl Text
						panel(new PanelBuilder() {{
							text(new TextBuilder() {{
								name("Spieleranzahltext");
								id("Spieleranzahltext");
								font("verdana-small-regular.fnt");
								color(new Color(1,1,1,1));
								text("NUMBER OF PLAYERS");
								interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
								
							}});
							backgroundColor(new Color(0, 1, 1, 0.1f));
							paddingLeft("5");
							width("564");
							height("30");
							visibleToMouse(true);
							childLayoutCenter();
							visible(true);
							interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
							
						}});
						//ENDE Spieleranzahl Text
						
						//panel um Image2Players/Image3Players/Image4Players
						panel(new PanelBuilder() {{
							backgroundColor(new Color(0, 1, 1, 0.01f));
							paddingTop("10");
							paddingLeft("150");
							width("590");
							height("70");
							visibleToMouse(true);
							childLayoutHorizontal();
							interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
							
						
							//Panel um Image2Players
							panel(new PanelBuilder() {{
								backgroundColor(new Color(0, 1, 1, 0.01f));
								width("81");
								height("65");
								visibleToMouse(true);
								childLayoutCenter();
								interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
							// Rahmen um Image2Players
						    panel(new PanelBuilder() {{
								id("borderImage2Players");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
								name("borderImage2Players");
								backgroundColor(new Color(0, 0, 0, 1));
								width("68");
								height("68");
								visibleToMouse(true);
								childLayoutAbsolute();
								interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
								visible(true);
						    }});//ENDE Rahmen um Image2Players
						//angeklickter-Rahmen um Image2Players
							panel(new PanelBuilder() {{
								id("borderImage2PlayersClicked");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
								name("borderImage2PlayersClicked");
								backgroundColor(new Color(1, 1, 1, 0.84f));
								//backgroundColor(new Color(1, 1, 1, 0.85f));
								//backgroundColor(new Color(1, 0.4f, 0.4f, 0.8f));
								//backgroundColor(new Color(1, 0.07f, 0.07f, 0.70f));
								width("68");
								height("68");
								visibleToMouse(true);
								childLayoutAbsolute();
								interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
								visible(false);
							}});//ENDE angeklickter-Rahmen um Image2Players		
						//Image2Players
						panel(new PanelBuilder() {{
							backgroundColor(new Color(0, 1, 1, 0.01f));
							width("81");
							height("60");
							visibleToMouse(true);
							childLayoutCenter();
							image(new ImageBuilder(){{
							filename("res/img/createGame/2players.png");
							width("60");
							height("60");
							alignCenter();
		    				valignCenter();
		    				visible(true);
		    				interactOnClick("image2Playersclick()");
		    				interactOnMouseOver("showInformationtextAndHovereffect(Image2Players)");
							}});
						}});
						//Ende Image2Players
						
						//Hovereffekt-Ebene von Image2Players
						panel(new PanelBuilder() {{
							id("HovereffectImage2Players");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
							name("HovereffectImage2Players");
							backgroundColor(new Color(1, 1, 1, 0.07f));
							width("68");
							height("68");
							visibleToMouse(true);
							childLayoutAbsolute();
							interactOnClick("image2Playersclick()");
							interactOnMouseOver("showInformationtextAndHovereffect(Image2Players)");
							visible(false);
						}});//ENDE Hovereffekt-Ebene von Image2Players	
						
							}});//Ende Panel um Image2Players
							
							
							//Panel um Image3Players
							panel(new PanelBuilder() {{
								backgroundColor(new Color(0, 1, 1, 0.01f));
								width("81");
								height("65");
								visibleToMouse(true);
								childLayoutCenter();
								interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
							// Rahmen um Image3Players
						    panel(new PanelBuilder() {{
								id("borderImage3Players");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
								name("borderImage3Players");
								backgroundColor(new Color(0, 0, 0, 1));
								width("68");
								height("68");
								visibleToMouse(true);
								childLayoutAbsolute();
								interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
								visible(true);
						    }});//ENDE Rahmen um Image3Players
						//angeklickter-Rahmen um Image3Players
							panel(new PanelBuilder() {{
								id("borderImage3PlayersClicked");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
								name("borderImage3PlayersClicked");
								backgroundColor(new Color(1, 1, 1, 0.84f));
								width("68");
								height("68");
								visibleToMouse(true);
								childLayoutAbsolute();
								interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
								visible(false);
							}});//ENDE angeklickter-Rahmen um Image3Players		
						//Image3Players
						panel(new PanelBuilder() {{
							backgroundColor(new Color(0, 1, 1, 0.01f));
							width("81");
							height("60");
							visibleToMouse(true);
							childLayoutCenter();
							image(new ImageBuilder(){{
							filename("res/img/createGame/3players.png");
							width("60");
							height("60");
							alignCenter();
		    				valignCenter();
		    				visible(true);
		    				interactOnClick("image3Playersclick()");
		    				interactOnMouseOver("showInformationtextAndHovereffect(Image3Players)");
							}});
						}});
						//Ende Image3Players
						
						//Hovereffekt-Ebene von Image3Players
						panel(new PanelBuilder() {{
							id("HovereffectImage3Players");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
							name("HovereffectImage3Players");
							backgroundColor(new Color(1, 1, 1, 0.07f));
							width("68");
							height("68");
							visibleToMouse(true);
							childLayoutAbsolute();
							interactOnClick("image3Playersclick()");
							interactOnMouseOver("showInformationtextAndHovereffect(Image3Players)");
							visible(false);
						}});//ENDE Hovereffekt-Ebene von Image3Players	
						
						}});//Ende Panel um Image3Players
							
							
							//Panel um Image4Players
							panel(new PanelBuilder() {{
								backgroundColor(new Color(0, 1, 1, 0.01f));
								width("81");
								height("65");
								visibleToMouse(true);
								childLayoutCenter();
								interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
							// Rahmen um Image4Players
						    panel(new PanelBuilder() {{
								id("borderImage4Players");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
								name("borderImage4Players");
								backgroundColor(new Color(0, 0, 0, 1));
								width("68");
								height("68");
								visibleToMouse(true);
								childLayoutAbsolute();
								interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
								visible(true);
						    }});//ENDE Rahmen um Image4Players
						//angeklickter-Rahmen um Image4Players
							panel(new PanelBuilder() {{
								id("borderImage4PlayersClicked");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
								name("borderImage4PlayersClicked");
								backgroundColor(new Color(1, 1, 1, 0.84f));
								width("68");
								height("68");
								visibleToMouse(true);
								childLayoutAbsolute();
								interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
								visible(false);
							}});//ENDE angeklickter-Rahmen um Image4Players			
						//Image4Players
						panel(new PanelBuilder() {{
							backgroundColor(new Color(0, 1, 1, 0.01f));
							width("81");
							height("60");
							visibleToMouse(true);
							childLayoutCenter();
							image(new ImageBuilder(){{
							filename("res/img/createGame/4players.png");
							width("60");
							height("60");
							alignCenter();
		    				valignCenter();
		    				visible(true);
		    				interactOnClick("image4Playersclick()");
		    				interactOnMouseOver("showInformationtextAndHovereffect(Image4Players)");
							}});
						}});
						//Ende Image4Players
						
						//Hovereffekt-Ebene von Image4Players
						panel(new PanelBuilder() {{
							id("HovereffectImage4Players");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
							name("HovereffectImage4Players");
							backgroundColor(new Color(1, 1, 1, 0.07f));
							width("68");
							height("68");
							visibleToMouse(true);
							childLayoutAbsolute();
							interactOnClick("image4Playersclick()");
							interactOnMouseOver("showInformationtextAndHovereffect(Image4Players)");
							visible(false);
						}});//ENDE Hovereffekt-Ebene von Image4Players	
						
							}});//Ende Panel um Image4Players
							
							
						
							
							interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
						}});
						//ENDE panel um Image2Players/Image3Players/Image4Players
			
						
						//Informationstexte MapPreviewImage/Image2Players/Image3Players/Image4Players
						panel(new PanelBuilder() {{
							backgroundColor(new Color(0, 1, 1, 0.01f));
							paddingLeft("0");
							width("550");
							height("34");
							visibleToMouse(true);
							childLayoutCenter();
							interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
							
						//Informationstext zu MapPreviewImage
						panel(new PanelBuilder() {{
							paddingTop("2");
							text(new TextBuilder() {{
								name("informationtextMapPreviewImage");
								id("informationtextMapPreviewImage");
								font("verdana-small-regular.fnt");
								color(new Color(1,1,1,1));
								text("Mapname");
								visible(false);
								interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
								
							}});
							backgroundColor(new Color(0, 1, 1, 0.01f));
							width("245");
							height("30");
							visibleToMouse(true);
							childLayoutCenter();
							visible(true);
							interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
						}});			
						
						//ENDE Informationstext zu MapPreviewImage
						
						//Informationstext zu Image2Players
						panel(new PanelBuilder() {{
							paddingTop("2");
							text(new TextBuilder() {{
								name("informationtextImage2Players");
								id("informationtextImage2Players");
								font("verdana-small-regular.fnt");
								color(new Color(1,1,1,1));
								text("2 Spieler-Spiel");
								visible(false);
								interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
							}});
							backgroundColor(new Color(0, 1, 1, 0.01f));
							width("245");
							height("30");
							visibleToMouse(true);
							childLayoutCenter();
							visible(true);
							interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
						}});			
						
						//ENDE Informationstext zu Image2Players
						
						//Informationstext zu Image3Players
						panel(new PanelBuilder() {{
							paddingTop("2");
							text(new TextBuilder() {{
								name("informationtextImage3Players");
								id("informationtextImage3Players");
								font("verdana-small-regular.fnt");
								color(new Color(1,1,1,1));
								text("3 Spieler-Spiel");
								visible(false);
								interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
							}});
							backgroundColor(new Color(0, 1, 1, 0.01f));
							width("245");
							height("30");
							visibleToMouse(true);
							childLayoutCenter();
							visible(true);
							interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
						}});
						//ENDE Informationstext zu Image3Players
						
						//Informationstext zu Image4Players
						panel(new PanelBuilder() {{
							paddingTop("2");
							text(new TextBuilder() {{
								name("informationtextImage4Players");
								id("informationtextImage4Players");
								font("verdana-small-regular.fnt");
								color(new Color(1,1,1,1));
								text("4 Spieler-Spiel");
								visible(false);
								interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
							}});
							backgroundColor(new Color(0, 1, 1, 0.01f));
							width("245");
							height("30");
							visibleToMouse(true);
							childLayoutCenter();
							visible(true);
							interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
						}});
						//ENDE Informationstext zu Image4Players
					}});//ENDE Informationstexte MapPreviewImage/Image2Players/Image3Players/Image4Players
						
						//chooseNumberofBotsText
						panel(new PanelBuilder() {{
							childLayoutCenter();
							
							text(new TextBuilder() {{
								name("chooseNumberOfBotstext");
								id("chooseNumberOfBotstext");
								font("verdana-small-regular.fnt");
								color(new Color(1,1,1,1));
								text("CHOOSE NUMBER OF BOTS");
								interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
							}});			
							backgroundColor(new Color(0, 1, 1, 0.1f));
							paddingLeft("5");
							width("564");
							height("30");
							visibleToMouse(true);
							childLayoutCenter();
							visible(true);
							interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
						}});
						//ENDE chooseNumberofBotsText
						
						//chooseNumberofBots
						
						
						panel(new PanelBuilder() {{
							childLayoutCenter();
							//Panel um Bilder und Buttons
							panel(new PanelBuilder() {{
								backgroundColor(new Color(1, 1, 1, 0.01f));
		                        childLayoutVertical();
								paddingTop("5");
								width("245");
								height("115");
								interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
								
								//unklickbareBotbilder	
								panel(new PanelBuilder() {{
									backgroundColor(new Color(1, 1, 1, 0.01f));
			                        childLayoutHorizontal();
									paddingTop("5");
									width("245");
									height("0");
								//unklickbareBotbilder inneres Panel
								panel(new PanelBuilder() {{
									backgroundColor(new Color(1, 1, 1, 0.01f));
			                        childLayoutHorizontal();
			                        interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
									
									paddingTop("5");
									paddingLeft("77");
									width("245");
									height("115");
								//ImageNoBots
								panel(new PanelBuilder() {{
									backgroundColor(new Color(0, 1, 1, 0.01f));
									width("81");
									height("60");
									visibleToMouse(true);
									childLayoutCenter();
									image(new ImageBuilder(){{
									filename("res/img/createGame/nobot.png");
									width("60");
									height("60");
									alignCenter();
					    			valignCenter();
					    			visible(true);
					    			}});
								}});
								//Ende ImageNoBots
								//Image1Bots
								panel(new PanelBuilder() {{
									backgroundColor(new Color(0, 1, 1, 0.01f));
									width("81");
									height("60");
									visibleToMouse(true);
									childLayoutCenter();
									image(new ImageBuilder(){{
									filename("res/img/createGame/1bot.png");
									width("60");
									height("60");
									alignCenter();
				    				valignCenter();
				    				visible(true);
									}});
								}});
								//Ende Image1Bots
								//Image2Bots
								panel(new PanelBuilder() {{
									backgroundColor(new Color(0, 1, 1, 0.01f));
									width("81");
									height("60");
									visibleToMouse(true);
									childLayoutCenter();
									image(new ImageBuilder(){{
									filename("res/img/createGame/2bots.png");
									width("60");
									height("60");
									alignCenter();
				    				valignCenter();
				    				visible(true);
									}});
								}});
								//Ende Image2Bots
								//Image3Bots
								panel(new PanelBuilder() {{
									backgroundColor(new Color(0, 1, 1, 0.01f));
									width("81");
									height("60");
									visibleToMouse(true);
									childLayoutCenter();
									image(new ImageBuilder(){{
									filename("res/img/createGame/3bots.png");
									width("60");
									height("60");
									alignCenter();
				    				valignCenter();
				    				visible(true);
									}});
								}});
								//Ende Image3Bots
								//Image4Bots
								panel(new PanelBuilder() {{
									backgroundColor(new Color(0, 1, 1, 0.01f));
									width("81");
									height("60");
									visibleToMouse(true);
									childLayoutCenter();
									image(new ImageBuilder(){{
									filename("res/img/createGame/4bots.png");
									width("60");
									height("60");
									alignCenter();
				    				valignCenter();
				    				visible(true);
									}});
								}});
								//Ende Image5Bots
						
								}});//ENDE unklickbareBotbilder	inneres Panel
								}});//ENDE unklickbareBotbilder	
								//panel um ImageNoBots/Image1Bots/Image2Bots/Image3Bots/Image4Bots
								panel(new PanelBuilder() {{
									backgroundColor(new Color(0, 1, 1, 0.01f));
									paddingTop("10");
									paddingLeft("77");
									width("590");
									height("70");
									visibleToMouse(true);
									childLayoutHorizontal();
									interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
									//Panel um ImageNoBots
									panel(new PanelBuilder() {{
										id("ImageNoBots");
										visible(false);
										backgroundColor(new Color(0, 1, 1, 0.01f));
										width("81");
										height("65");
										visibleToMouse(true);
										childLayoutCenter();
										interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
									// Rahmen um ImageNoBots
								    panel(new PanelBuilder() {{
										id("borderImageNoBots");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
										name("borderImageNoBots");
										backgroundColor(new Color(0, 0, 0, 1));
										width("68");
										height("68");
										visibleToMouse(true);
										childLayoutAbsolute();
										interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
										visible(true);
								    }});//ENDE Rahmen um ImageNoBots
								//angeklickter-Rahmen um ImageNoBots
									panel(new PanelBuilder() {{
										id("borderImageNoBotsClicked");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
										name("borderImageNoBotsClicked");
										backgroundColor(new Color(1, 1, 1, 0.84f));
										width("68");
										height("68");
										visibleToMouse(true);
										childLayoutAbsolute();
										interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
										visible(false);
									}});//ENDE angeklickter-Rahmen um ImageNoBots		
								//ImageNoBots
								panel(new PanelBuilder() {{
									backgroundColor(new Color(0, 1, 1, 0.01f));
									width("81");
									height("60");
									visibleToMouse(true);
									childLayoutCenter();
									image(new ImageBuilder(){{
									filename("res/img/createGame/nobot.png");
									width("60");
									height("60");
									alignCenter();
				    				valignCenter();
				    				visible(true);
				    				interactOnClick("imageNoBotsclick()");
				    				interactOnMouseOver("showInformationtextAndHovereffectBots(ImageNoBots)");
									}});
								}});
								//Ende ImageNoBots
								
								//Hovereffekt-Ebene von ImageNoBots
								panel(new PanelBuilder() {{
									id("HovereffectImageNoBots");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
									name("HovereffectImageNoBots");
									backgroundColor(new Color(1, 1, 1, 0.07f));
									width("68");
									height("68");
									visibleToMouse(true);
									childLayoutAbsolute();
									interactOnClick("imageNoBotsclick()");
									interactOnMouseOver("showInformationtextAndHovereffectBots(ImageNoBots)");
									visible(false);
								}});//ENDE Hovereffekt-Ebene von ImageNoBots	
								
									}});//Ende Panel um ImageNoBots
									
									//Panel um Image1Bots
									panel(new PanelBuilder() {{
										id("Image1Bots");
										visible(false);
										backgroundColor(new Color(0, 1, 1, 0.01f));
										width("81");
										height("65");
										visibleToMouse(true);
										childLayoutCenter();
										interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
										
									// Rahmen um Image1Bots
								    panel(new PanelBuilder() {{
										id("borderImage1Bots");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
										name("borderImage1Bots");
										backgroundColor(new Color(0, 0, 0, 1));
										width("68");
										height("68");
										visibleToMouse(true);
										childLayoutAbsolute();
										interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
										visible(true);
								    }});//ENDE Rahmen um Image1Bots
								//angeklickter-Rahmen um Image1Bots
									panel(new PanelBuilder() {{
										id("borderImage1BotsClicked");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
										name("borderImage1BotsClicked");
										backgroundColor(new Color(1, 1, 1, 0.84f));
										width("68");
										height("68");
										visibleToMouse(true);
										childLayoutAbsolute();
										interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
										visible(false);
									}});//ENDE angeklickter-Rahmen um Image1Bots		
								//Image1Bots
								panel(new PanelBuilder() {{
									backgroundColor(new Color(0, 1, 1, 0.01f));
									width("81");
									height("60");
									visibleToMouse(true);
									childLayoutCenter();
									image(new ImageBuilder(){{
									filename("res/img/createGame/1bot.png");
									width("60");
									height("60");
									alignCenter();
				    				valignCenter();
				    				visible(true);
				    				interactOnClick("image1Botsclick()");
				    				interactOnMouseOver("showInformationtextAndHovereffectBots(Image1Bots)");
									}});
								}});
								//Ende Image1Bots
								
								//Hovereffekt-Ebene von Image1Bots
								panel(new PanelBuilder() {{
									id("HovereffectImage1Bots");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
									name("HovereffectImage1Bots");
									backgroundColor(new Color(1, 1, 1, 0.07f));
									width("68");
									height("68");
									visibleToMouse(true);
									childLayoutAbsolute();
									interactOnClick("image1Botsclick()");
									interactOnMouseOver("showInformationtextAndHovereffectBots(Image1Bots)");
									visible(false);
								}});//ENDE Hovereffekt-Ebene von Image1Bots	
								
									}});//Ende Panel um Image1Bots
									
									
									//Panel um Image2Bots
									panel(new PanelBuilder() {{
										id("Image2Bots");
										visible(false);
										backgroundColor(new Color(0, 1, 1, 0.01f));
										width("81");
										height("65");
										visibleToMouse(true);
										childLayoutCenter();
										interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
									// Rahmen um Image2Bots
								    panel(new PanelBuilder() {{
										id("borderImage2Bots");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
										name("borderImage2Bots");
										backgroundColor(new Color(0, 0, 0, 1));
										width("68");
										height("68");
										visibleToMouse(true);
										childLayoutAbsolute();
										interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
										visible(true);
								    }});//ENDE Rahmen um Image2Bots
								//angeklickter-Rahmen um Image2Bots
									panel(new PanelBuilder() {{
										id("borderImage2BotsClicked");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
										name("borderImage2BotsClicked");
										backgroundColor(new Color(1, 1, 1, 0.84f));
										width("68");
										height("68");
										visibleToMouse(true);
										childLayoutAbsolute();
										interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
										visible(false);
									}});//ENDE angeklickter-Rahmen um Image2Bots		
								//Image2Bots
								panel(new PanelBuilder() {{
									backgroundColor(new Color(0, 1, 1, 0.01f));
									width("81");
									height("60");
									visibleToMouse(true);
									childLayoutCenter();
									image(new ImageBuilder(){{
									filename("res/img/createGame/2bots.png");
									width("60");
									height("60");
									alignCenter();
				    				valignCenter();
				    				visible(true);
				    				interactOnClick("image2Botsclick()");
				    				interactOnMouseOver("showInformationtextAndHovereffectBots(Image2Bots)");
									}});
								}});
								//Ende Image2Bots
								
								//Hovereffekt-Ebene von Image2Bots
								panel(new PanelBuilder() {{
									id("HovereffectImage2Bots");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
									name("HovereffectImage2Bots");
									backgroundColor(new Color(1, 1, 1, 0.07f));
									width("68");
									height("68");
									visibleToMouse(true);
									childLayoutAbsolute();
									interactOnClick("image2Botsclick()");
									interactOnMouseOver("showInformationtextAndHovereffectBots(Image2Bots)");
									visible(false);
								}});//ENDE Hovereffekt-Ebene von Image2Bots	
								
									}});//Ende Panel um Image2Bots
									
									
									//Panel um Image3Bots
									panel(new PanelBuilder() {{
										id("Image3Bots");
										visible(false);
										backgroundColor(new Color(0, 1, 1, 0.01f));
										width("81");
										height("65");
										visibleToMouse(true);
										childLayoutCenter();
										interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
									// Rahmen um Image3Bots
								    panel(new PanelBuilder() {{
										id("borderImage3Bots");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
										name("borderImage3Bots");
										backgroundColor(new Color(0, 0, 0, 1));
										width("68");
										height("68");
										visibleToMouse(true);
										childLayoutAbsolute();
										interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
										visible(true);
								    }});//ENDE Rahmen um Image3Bots
								//angeklickter-Rahmen um Image3Bots
									panel(new PanelBuilder() {{
										id("borderImage3BotsClicked");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
										name("borderImage3BotsClicked");
										backgroundColor(new Color(1, 1, 1, 0.84f));
										width("68");
										height("68");
										visibleToMouse(true);
										childLayoutAbsolute();
										interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
										visible(false);
									}});//ENDE angeklickter-Rahmen um Image3Bots		
								//Image3Bots
								panel(new PanelBuilder() {{
									backgroundColor(new Color(0, 1, 1, 0.01f));
									width("81");
									height("60");
									visibleToMouse(true);
									childLayoutCenter();
									image(new ImageBuilder(){{
									filename("res/img/createGame/3bots.png");
									width("60");
									height("60");
									alignCenter();
				    				valignCenter();
				    				visible(true);
				    				interactOnClick("image3Botsclick()");
				    				interactOnMouseOver("showInformationtextAndHovereffectBots(Image3Bots)");
									}});
								}});
								//Ende Image3Bots
								
								//Hovereffekt-Ebene von Image3Bots
								panel(new PanelBuilder() {{
									id("HovereffectImage3Bots");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
									name("HovereffectImage3Bots");
									backgroundColor(new Color(1, 1, 1, 0.07f));
									width("68");
									height("68");
									visibleToMouse(true);
									childLayoutAbsolute();
									interactOnClick("image3Botsclick()");
									interactOnMouseOver("showInformationtextAndHovereffectBots(Image3Bots)");
									visible(false);
								}});//ENDE Hovereffekt-Ebene von Image3Bots	
								
								}});//Ende Panel um Image3Bots
									
									
									//Panel um Image4Bots
									panel(new PanelBuilder() {{
										id("Image4Bots");
										visible(false);
										backgroundColor(new Color(0, 1, 1, 0.01f));
										width("81");
										height("65");
										visibleToMouse(true);
										childLayoutCenter();
										interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
									// Rahmen um Image4Bots
								    panel(new PanelBuilder() {{
										id("borderImage4Bots");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
										name("borderImage4Bots");
										backgroundColor(new Color(0, 0, 0, 1));
										width("68");
										height("68");
										visibleToMouse(true);
										childLayoutAbsolute();
										interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
										visible(true);
								    }});//ENDE Rahmen um Image4Bots
								//angeklickter-Rahmen um Image4Bots
									panel(new PanelBuilder() {{
										id("borderImage4BotsClicked");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
										name("borderImage4BotsClicked");
										backgroundColor(new Color(1, 1, 1, 0.84f));
										width("68");
										height("68");
										visibleToMouse(true);
										childLayoutAbsolute();
										interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
										visible(false);
									}});//ENDE angeklickter-Rahmen um Image4Bots			
								//Image4Bots
								panel(new PanelBuilder() {{
									backgroundColor(new Color(0, 1, 1, 0.01f));
									width("81");
									height("60");
									visibleToMouse(true);
									childLayoutCenter();
									image(new ImageBuilder(){{
									filename("res/img/createGame/4bots.png");
									width("60");
									height("60");
									alignCenter();
				    				valignCenter();
				    				visible(true);
				    				interactOnClick("image4Botsclick()");
				    				interactOnMouseOver("showInformationtextAndHovereffectBots(Image4Bots)");
									}});
								}});
								//Ende Image4Bots
								
								//Hovereffekt-Ebene von Image4Bots
								panel(new PanelBuilder() {{
									id("HovereffectImage4Bots");//muss man komischerweise zum benutzen der findElementByName-funktion angeben
									name("HovereffectImage4Bots");
									backgroundColor(new Color(1, 1, 1, 0.07f));
									width("68");
									height("68");
									visibleToMouse(true);
									childLayoutAbsolute();
									interactOnClick("image4Botsclick()");
				    				//interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
									interactOnMouseOver("showInformationtextBotsAndHovereffect(Image4Bots)");
									visible(false);
								}});//ENDE Hovereffekt-Ebene von Image4Bots	
								
									}});//Ende Panel um Image4Bots
									
								

									
								
									
									interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
								}});
								//ENDE panel um ImageNoBot/Image1Bots/Image2Bots/Image3Bots/Image4Bots/
					
								
								//Informationstexte MapPreviewImage/Image2Bots/Image3Bots/Image4Bots
								panel(new PanelBuilder() {{
									backgroundColor(new Color(0, 1, 1, 0.01f));
									paddingLeft("0");
									width("550");
									height("34");
									visibleToMouse(true);
									childLayoutCenter();
									interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
								//Informationstext zu MapPreviewImageBots
								panel(new PanelBuilder() {{
									paddingTop("2");
									text(new TextBuilder() {{
										name("informationtextMapPreviewImageBots");
										id("informationtextMapPreviewImageBots");
										font("verdana-small-regular.fnt");
										color(new Color(1,1,1,1));
										text("Mapname");
										visible(false);
										//interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
									}});
									backgroundColor(new Color(0, 1, 1, 0.01f));
									width("245");
									height("30");
									visibleToMouse(true);
									childLayoutCenter();
									visible(true);
								}});			
								
								//ENDE Informationstext zu MapPreviewImageBots
								
								
								//Informationstext zu ImageNoBots
								panel(new PanelBuilder() {{
									paddingTop("2");
									text(new TextBuilder() {{
										name("informationtextImageNoBots");
										id("informationtextImageNoBots");
										font("verdana-small-regular.fnt");
										color(new Color(1,1,1,1));
										text("no Bots");
										visible(false);
										interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
									}});
									backgroundColor(new Color(0, 1, 1, 0.01f));
									width("245");
									height("30");
									visibleToMouse(true);
									childLayoutCenter();
									visible(true);
								}});			
								
								//ENDE Informationstext zu Image0Bots
								
								//Informationstext zu Image1Bots
								panel(new PanelBuilder() {{
									paddingTop("2");
									text(new TextBuilder() {{
										name("informationtextImage1Bots");
										id("informationtextImage1Bots");
										font("verdana-small-regular.fnt");
										color(new Color(1,1,1,1));
										text("1 Bot");
										visible(false);
										interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
									}});
									backgroundColor(new Color(0, 1, 1, 0.01f));
									width("245");
									height("30");
									visibleToMouse(true);
									childLayoutCenter();
									visible(true);
								}});			
								
								//ENDE Informationstext zu Image2Bots
								
								
								//Informationstext zu Image2Bots
								panel(new PanelBuilder() {{
									paddingTop("2");
									text(new TextBuilder() {{
										name("informationtextImage2Bots");
										id("informationtextImage2Bots");
										font("verdana-small-regular.fnt");
										color(new Color(1,1,1,1));
										text("2 Bots");
										visible(false);
										interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
									}});
									backgroundColor(new Color(0, 1, 1, 0.01f));
									width("245");
									height("30");
									visibleToMouse(true);
									childLayoutCenter();
									visible(true);
								}});			
								
								//ENDE Informationstext zu Image2Bots
								
								//Informationstext zu Image3Bots
								panel(new PanelBuilder() {{
									paddingTop("2");
									text(new TextBuilder() {{
										name("informationtextImage3Bots");
										id("informationtextImage3Bots");
										font("verdana-small-regular.fnt");
										color(new Color(1,1,1,1));
										text("3 Bots");
										visible(false);
										interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
									}});
									backgroundColor(new Color(0, 1, 1, 0.01f));
									width("245");
									height("30");
									visibleToMouse(true);
									childLayoutCenter();
									visible(true);
								}});
								//ENDE Informationstext zu Image3Bots
								
								//Informationstext zu Image4Bots
								panel(new PanelBuilder() {{
									paddingTop("2");
									text(new TextBuilder() {{
										name("informationtextImage4Bots");
										id("informationtextImage4Bots");
										font("verdana-small-regular.fnt");
										color(new Color(1,1,1,1));
										text("4 Bots");
										visible(false);
										interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
									}});
									backgroundColor(new Color(0, 1, 1, 0.01f));
									width("245");
									height("30");
									visibleToMouse(true);
									childLayoutCenter();
									visible(true);
								}});
								//ENDE Informationstext zu Image4Bots
							}});//ENDE Informationstexte MapPreviewImage/Image2Bots/Image3Bots/Image4Bots
							}});//Ende ButtonBilderunso	
						}});//ENDE chooseNumberofBots
						
						//white field
						panel(new PanelBuilder() {{
							backgroundColor(new Color(0, 1, 1, 0.1f));
							paddingLeft("5");
							width("564");
							height("30");
							visibleToMouse(true);
							childLayoutCenter();
							visible(true);
						}});
						//ENDE white field
					
						
					//Panel um backToLobby/createGame buttons
					panel(new PanelBuilder() {{
						backgroundColor(new Color(1, 0, 1, 0.01f));
						paddingTop("0");
						paddingLeft("13");
						width("600");
						height("105");
						visibleToMouse(true);
						childLayoutHorizontal();
						interactOnMouseOver("hideAllInformationtextsAndHovereffekts()");
					//Back to Lobby Button
					panel(new PanelBuilder() {{
						backgroundColor(new Color(1, 0, 1, 0.01f));
						width("270");
						height("50");
						visibleToMouse(true);
						childLayoutCenter();
						control(new ButtonBuilder("backToLobbyButton", "BACK TO LOBBY") {{
							width("120");
							height("30");
							interactOnClick("backToLobby()");						
							visibleToMouse(true);
							alignLeft();
						}});
					}});
					//ENDE Back to Lobby Button
					
					//start Game Button
					panel(new PanelBuilder() {{
						backgroundColor(new Color(1, 0, 1, 0.01f));
						width("270");
						height("50");
						visibleToMouse(true);
						childLayoutCenter();
						control(new ButtonBuilder("createGameButtonPopUp", "CREATE GAME") {{
							width("120");
							height("30");
							interactOnClick("createGameButtonclick()");
							visibleToMouse(true);
							alignRight();					
						}});
					}});
					//ENDE start Game Button
					}});//ENDE Panel um back/startGame buttons
					}});//ENDE Panel um Bilder und Buttons
					
					
				}});				
				panel(new PanelBuilder() {{
					alignLeft();
					childLayoutAbsolute();	
					paddingTop("50px");						
				}});
				

			}});//ENDE Gro�es aeu�eres Panel um mapPreviewImage/Bots2Image/Bots3Image/Bots4Image und die buttons,logo etc (rechts)
		//ENDE Aeu�eres Panel		
		
			}
		}.registerPopup(gui.getNifty());

		createGame = gui.getNifty().createPopup("createGame");
		maps = createGame.findNiftyControl("maplist", ListBox.class);
		createGameButtonPopup = createGame.findNiftyControl("createGameButtonPopUp", Button.class);
		mapnametext = createGame.findElementByName("Mapnametext").getRenderer(TextRenderer.class);
		createGame.findElementByName("eingabeName").addInputHandler(new KeyInputHandler() {
			@Override
			public boolean keyEvent(NiftyInputEvent inputEvent) {
				getLobbyController().getCreateGameController().updateCreateButton();
				
				if(inputEvent != null) {
					switch (inputEvent) {
					case SubmitText:
						lobbyController.getCreateGameController().createGameButtonclick();
						return true;
					default: 
						return false;
					}
				}
				
				return false;
			}
		});
	}

	boolean i = false;
	
	public void showScreen(){
		gui.getNifty().showPopup(gui.getNifty().getScreen("lobby"), createGame.getId(), null);
		
		for(Map m : lobbyController.getGui().getStart().getModel().getMaps()) {
			maps.addItem(m.getName());
		}
		
		if(maps.getItems().size() > 0) {
			maps.selectItemByIndex(0);
		}
		
		mapnametext.setText(maps.getFocusItem());
		createGameButtonPopup.disable();
		lobbyController.getCreateGameController().imageNoBotsclick();
		lobbyController.getCreateGameController().image2Playersclick();
	}
	
	public ListBox<String> getMaps() {
		return maps;
	}
	
	public Element getCreateGame() {
		return createGame;
	}
	
	public LobbyController getLobbyController() {
		return lobbyController;
	}
}
